<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>添加用户管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/layui/css/layui.css" />
    <link rel="stylesheet" href="/static/ui/css/ui.css" />
</head>

<body>
    <form class="layui-form" action="" lay-filter="editform">
        <div class="mainBox">
            <div class="main-container">

                <div class="layui-tab layui-tab-card">
                    <ul class="layui-tab-title">
                        <li class="layui-this">用户设置</li>
                        <li>权限分配</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">

                            <div class="layui-form-item">
                                <label class="layui-form-label">用户名</label>
                                <div class="layui-input-block">
                                    <input type="text" name="username" id="username" lay-verify="required|len"
                                        autocomplete="off" min="3" placeholder="请输入名称" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">密码</label>
                                <div class="layui-input-block">
                                    <input type="password" name="password" autocomplete="off"
                                        placeholder="请输入登录密码，为空则不修改" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">真实姓名</label>
                                <div class="layui-input-block">
                                    <input type="text" name="name" autocomplete="off" placeholder="请输入真实姓名"
                                        class="layui-input" lay-verify="required|len" min="2">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">手机号</label>
                                <div class="layui-input-block">
                                    <input type="text" name="phone" autocomplete="off"
                                        placeholder="请输入手机号" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">座机号</label>
                                <div class="layui-input-block">
                                    <input type="text" name="telephone" autocomplete="off" placeholder="请输入座机号"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">工号</label>
                                <div class="layui-input-block">
                                    <input type="text" name="job_number" autocomplete="off" placeholder="请输入工号"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">工作地址</label>
                                <div class="layui-input-block">
                                    <input type="text" name="work_place" autocomplete="off" placeholder="请输入工作地址"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">入职时间</label>
                                <div class="layui-input-block">
                                    <input type="text" name="hired_date" lay-verify="required" id="hired_date" autocomplete="off" placeholder="请输入入职时间"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">状态</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="status" value="0" title="开启" checked>
                                    <input type="radio" name="status" value="1" title="关闭">
                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">备注</label>
                                <div class="layui-input-block">
                                    <textarea name="remark" placeholder="请输入内容" class="layui-textarea"></textarea>
                                </div>
                            </div>

                        </div>
                        <div class="layui-tab-item">

                            <div class="layui-form-item">
                                <label class="layui-form-label">角色</label>
                                <div class="layui-input-block">
                                    <div id="role-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">数据权限</label>
                                <div class="layui-input-inline" style="width:280px">
                                    <input type="radio" name="userType" value="-1" title="全部"
                                        lay-filter="choose-user-btn">
                                    <input type="radio" name="userType" value="0" title="自己" checked
                                        lay-filter="choose-user-btn">
                                    <input type="radio" name="userType" value="1" title="指定"
                                        lay-filter="choose-user-btn">
                                    <!--input type="radio" name="userType" value="2" title="系统"-->
                                </div>
                                <div class="layui-input-inline" style="width:300px">
                                    <div id="users-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">公司</label>
                                <div class="layui-input-block">
                                    <div id="company-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">部门</label>
                                <div class="layui-input-block">
                                    <div id="dept-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">门店</label>
                                <div class="layui-input-block">
                                    <div id="store-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">仓库</label>
                                <div class="layui-input-block">
                                    <div id="stock-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">岗位</label>
                                <div class="layui-input-block">
                                    <div id="pos-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">地区</label>
                                <div class="layui-input-block">
                                    <div id="area-area" class="xm-select-demo"></div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">项目</label>
                                <div class="layui-input-block">
                                    <div id="project-area" class="xm-select-demo"></div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>


            </div>
        </div>
        <div class="bottom">
            <div class="button-container">
                <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit=""
                    lay-filter="user-save">
                    <i class="layui-icon layui-icon-ok"></i>
                    提交
                </button>
            </div>
        </div>
    </form>
    <script src="../config.js"></script>
    <script src="/static/layui/layui.js"></script>
    <script src="/static/ui/ui.js"></script>
    <script src="/static/utils/xm-select.js"></script>
    <script src="../utils/select.js"></script>
    <script>
        layui.use(['form', 'layer', 'tree', 'element','laydate'], function () {
            let form = layui.form
                , layer = layui.layer
                , element = layui.element
                , laydate = layui.laydate
                , $ = layui.$
                , req = _req();
            laydate.render({ 
                elem: '#hired_date' //开始时间和结束时间所在 input 框的父选择器
            });
            form.verify({
                len: (val, item) => {
                    let min = item.getAttribute("min")
                    if (val.length < min) {
                        return '长度不能小于' + min;
                    }
                }
            })
            const renderForm = (res) => {
                console.log(res)
                let chooseUsersIns = getElSelect(res.userlist, res.ext_user, 'users-area', 'checkbox', false, { name: 'ext_user' });

                form.on('radio(choose-user-btn)', (obj) => {
                    //console.log(obj)
                    if (obj.value == 1) {
                        setTimeout(function () {
                            chooseUsersIns.opened();
                        }, 100);
                    } else {
                        chooseUsersIns.setValue([])
                    }

                })
                getElSelect(res.companys, res.ext_user_company, 'company-area', 'checkbox', true, { name: 'ext_user_company' });
                getElSelect(res.depts, res.ext_user_dept, 'dept-area', 'checkbox', true, { name: 'ext_user_dept' });
                getElSelect(res.stores, res.ext_user_store, 'store-area', 'checkbox', false, { name: 'ext_user_store' });
                getElSelect(res.roles, res.ext_user_role, 'role-area', 'checkbox', true, { name: 'ext_user_role' });
                getElSelect(res.pos, res.ext_user_pos, 'pos-area', 'checkbox', false, { name: 'ext_user_pos' });
                getElSelect(res.stocks, res.ext_stock_storehouse, 'stock-area', 'checkbox', false, { name: 'ext_stock_storehouse' });
                getElSelect(res.projects, res.ext_project, 'project-area', 'checkbox', false, { name: 'ext_project' });
                getAreaSelect('area-area', 'ext_user_area', 'checkbox', res.ext_user_area)
            }
            if (req.id) {
                //渲染
                _get(layui, 'user/editBefore?id=' + req.id, res => {
                    renderForm(res)
                    form.val('editform', res)
                    
                });
            } else {
                _get(layui, 'user/addBefore', res => {
                    renderForm(res)
                });
            }

            //监听提交
            form.on('submit(user-save)', function (data) {
                data = data.field;
                let postUrl;
                if (req.id) {
                    postUrl = 'user/edit';
                    data.id = req.id;
                } else {
                    postUrl = 'user/add';

                }
                // console.log(data)
                // return false;
                // data.company_id = getSelectData(companyIns)
                // data.dept_id = getSelectData(deptIns)
                // data.store_id = getSelectData(storeIns)
                // data.role_id = getSelectData(rolesIns)
                // data.pos_id = getSelectData(posIns)
                // data.stock_id = getSelectData(stocksIns)
                _post(layui, postUrl, data, res => {
                    //console.log(res)
                    parent.layui.table.reload("user-table");
                    parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页

                })

                return false;
            });

        });
    </script>

</body>

</html>